<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>H5表单</title>
</head>
<body>
<h1>H5表单</h1>

<h4>学习目标</h4>
<ol>
    <li>了解H5表单</li>
</ol>

<script type="text/javascript">


    // -----------------------------
    // 1. H5
    // -----------------------------
    /*
        HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。
     */


    // -----------------------------
    // 2. color
    // -----------------------------
    /*
        <input type="color">
     */
    // 2.1 设置一个div，根据颜色选择值更改div边框和背景色，使用jquery实现。


    // -----------------------------
    // 3. date
    // -----------------------------
    /*
        <input type="date">
     */
    // 3.1 设置一个表单项，用于选择用户生日。


    // -----------------------------
    // 4. email
    // -----------------------------
    /*
        <input type="email" name="email">
     */
    // 4.1 设置一个表单项，输入用户的email


    // -----------------------------
    // 5. number
    // -----------------------------
    /*
        <input type="number" name="quantity" min="1" max="5">
     */
    // 5.1 设置一个表单项，表示购买数量。


</script>
</body>
</html>